import { h, Component } from 'preact';
import Button from '../../../../components/Button';
import Timeline from '../../../../components/Timeline';
import Icon from '../../../../components/Icon';

class ETimeline extends Component {
	constructor(props) {
		super(props);
		this.state = {
			mode: 'left'
		};
	}

	componentDidMount() {

	}

    clickMode = _ => {
    	this.setState({ mode: _ });
    }

    render(p,state) {
    	return (
    		<div>
    			<Button.Group size="small">
    				<Button type="primary" onClick={() => this.clickMode('left')}>left</Button>
    				<Button type="info" onClick={() => this.clickMode('right')}>right</Button>
    				<Button type="success" onClick={() => this.clickMode('alternate')}>alternate</Button>
    			</Button.Group>
                <hr />
    			<Timeline mode={state.mode}>
    				<Timeline.Item dot={<Icon type="car"/>}>日子艰辛</Timeline.Item>
    				<Timeline.Item>找工作</Timeline.Item>
                    <Timeline.Item dot={<Icon type="calendar"/>}>我毕业</Timeline.Item>
    			</Timeline>
    		</div>
    	);
    }
}

ETimeline.propTypes = {

};

export default ETimeline;
